<template>
  <div>
    <el-card>
      <h3 class="_content_title">菜单列表</h3>
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item label="菜单名称">
          <el-input v-model="formInline.Name" placeholder="菜单名称"></el-input>
        </el-form-item>
        <el-form-item class="_content_button">
          <el-button type="primary" @click="onSubmit" icon="el-icon-search">查询</el-button>
          <el-button type="success" @click="onAdd" icon="el-icon-edit">新增</el-button>
        </el-form-item>
      </el-form>
    </el-card>

    <!--列表-->
    <com-tableview
      :datas="datas"
      :cols="cols"
      :loading="loading"
      :totalrows="total_rows"
      :filter="filter"
      :buttonGroup="buttonGroup"
      @pageSizeChange="pageSizeChange"
      @pageCurrentChange="pageCurrentChange"
      @buttonEvent="buttonEvent"
    ></com-tableview>


      <!--查看-->
    <el-dialog title="查看菜单信息" width="70%"  :visible.sync="dialogViewVisible">
      <sub-Detail
        :currentId="currentId"
        :dialogViewVisible.sync="dialogViewVisible"
        :random="random"
        @SuccessReturn="SuccessReturn"
      ></sub-Detail>
    </el-dialog>

    <!--新增-->
    <el-dialog title="新增菜单信息" width="70%" :visible.sync="dialogAddVisible">
      <sub-Add
        :dialogViewVisible.sync="dialogAddVisible"
        @SuccessReturn="SuccessReturn"
        :random="random"
      ></sub-Add>
    </el-dialog>

    <!--编辑-->
    <el-dialog title="编辑菜单信息" width="70%"  :visible.sync="dialogEditVisible">
      <sub-Edit
        :currentId="currentId"
        :dialogViewVisible.sync="dialogEditVisible"
        @SuccessReturn="SuccessReturn"
        :random="random"
      ></sub-Edit>
    </el-dialog>

  </div>
</template>
<script>
import { mixinlistMixed } from "@/mixedObject/listMixed";
import tableview from "@/components/Table";
import detail from "./detail";
import add from "./add";
import edit from "./edit";
export default {
  mixins:[mixinlistMixed],
  components: {
    //表格
    "com-tableview": tableview,
    //详情页
    "sub-Detail": detail,
    //新增
    "sub-Add": add,
    //编辑
    "sub-Edit": edit,
  },
  data() {
    return {
      /**表格**/
      cols: [
        { prop: "name", label: "菜单名称" },
        { prop: "customData", label: "授权码" },
        { prop: "sort", label: "排序" },
      ],
      buttonGroup: [
        {
          name: "查看",
          type: "success",
          icon: "el-icon-view",
          incident: "viewData"
        },
        {
          name: "编辑",
          type: "success",
          icon: "el-icon-edit",
          incident: "EditData"
        }
      ],
      /**搜索条件**/
      formInline: {
        Name:"",
        ParentId:"",
        PageIndex: 1,
        PageSize: 10
      }
    };
  },
  created () {
      this.initData();
  },
  methods: {
       //初始化
    initData() {
      this.formInline.PageIndex = this.filter.page;
      this.formInline.PageSize = this.filter.per_page;

      this.$store
        .dispatch("menu/GetMenuInfoList", this.formInline)
        .then(data => {
          console.log(data);
          this.datas = data.listData;
          this.total_rows = data.total;
        });
    },
    //搜索
    onSubmit() {
      this.initData();
    },
  },
};
</script>